<?php include('scripts.php'); ?>

<style type="text/css">
.tbl_form td {
    padding: 3px 1px !important;
}
.pbl_table td {
    border: 1px solid #434343;
    color: #000000;
    padding: 2px;
}
</style>

<script type="text/javascript" language="javascript">
$(function() {
    $("#topupForm").validate({
        messages : {
            transactionPassword: {
                remote: "Security Password is not valid."
            }
        },
        rules : {
            "transactionPassword" : {
                required : true
                , remote: "/member/verifyTransactionPassword"
            }
        },
        submitHandler: function(form) {
            var epointAvailable = parseFloat($('#topup_pointAvail').autoNumericGet());
            var ecashAvailable = parseFloat($('#topup_ecashAvail').autoNumericGet());
            var fxpromaxAvailable = parseFloat($('#topup_fxpromaxAvail').autoNumericGet());
            var epointPaid = parseFloat($('#epointPaid').autoNumericGet());
            var ecashPaid = parseFloat($('#ecashPaid').autoNumericGet());
            var packagePrice = parseFloat($("input[name='pid']:checked").attr("ref"));

            if (doCalculate("epointPaid", "ecashPaid", $("input[name='pid']:checked").attr("ref")) == false) {
                return false;
            }

            if ($("#walletType").val() == "FXPROMAX") {
                ecashAvailable = fxpromaxAvailable;
            }

            if (epointAvailable < epointPaid) {
                error("In-sufficient e-Point to purchase package.");
                return false;
            }
            if (ecashAvailable < ecashPaid) {
                if ($("#walletType").val() == "FXPROMAX") {
                    error("In-sufficient Fxpromax Wallet to purchase package.");
                } else {
                    error("In-sufficient e-Wallet to purchase package.");
                }
                return false;
            }

            var totalPaid = epointPaid + ecashPaid;
            if (totalPaid < packagePrice) {
                error("In-sufficient fund to purchase package");
                return false;
            }
            if (totalPaid > packagePrice) {
                error("Amount Paid is not tally with package price");
                return false;
            }

            waiting();
            $('#epointPaid').val(epointPaid);
            $('#ecashPaid').val(ecashPaid);

            form.submit();
        }
    });

    $(".activeLink").button({
        icons: {
            primary: "ui-icon-circle-arrow-n"
        }
    }).click(function(event) {
        event.preventDefault();
        var epointNeeded = $(this).attr("ref");
        var pid = $(this).attr("pid");

        $('#epointNeeded').val(epointNeeded);
        $('#pid').val(pid);
        $("#topupForm").submit();
    });

    $("input[name='pid']").click(function(event){
        $("#epointPaid").autoNumericSet($(this).attr("ref"));
    });

    $("input[name='pid']:first").trigger("click");

    $("#epointPaid").autoNumeric().focus(function(){
        $(this).select();
    }).change(function(){
        doCalculate("epointPaid", "ecashPaid", $("input[name='pid']:checked").attr("ref"));
    });
    $("#ecashPaid").autoNumeric().focus(function(){
        $(this).select();
    });
    $("#walletType").change(function(event){
        var walletType = $(this).val();
        if (walletType == "ECASH") {
            $("#tdEwalletLabel").html("e-Wallet Paid");
        } else if (walletType == "FXPROMAX") {
            $("#tdEwalletLabel").html("Fxpromax Wallet Paid");
        }
    });
});

function doCalculate(epointPaidId, ecashPaidId, packagePrice) {
    var packagePrice = parseFloat(packagePrice);
    var packagePriceEcashMax = packagePrice / 2;
    var ecash = $("#" + ecashPaidId).autoNumericGet();
    var epoint = parseFloat($("#" + epointPaidId).autoNumericGet());

    if (ecash > packagePriceEcashMax) {
        if ($("#walletType").val() == "FXPROMAX") {
            error("Maximum Fxpromax Wallet allowed is " + packagePriceEcashMax);
        } else {
            error("Maximum e-Wallet allowed is " + packagePriceEcashMax);
        }

        $("#" + ecashPaidId).autoNumericSet(packagePriceEcashMax);

        return false;
    } else {
        if (parseFloat(epoint) < parseFloat(packagePrice)) {
            var balance = packagePrice - epoint;

            $("#" + ecashPaidId).autoNumericSet(balance);
        }
    }
    return true;
}
</script>

<div id="sub_title" class="highlight"><span class="taller red"></span>

    <p style="font-size: 16px; font-weight: bold;"><?php echo __('Package Upgrade') ?></p></div>

<table cellpadding="0" cellspacing="0">
    <tr>
        <td width="15px" style="min-height: 600px;">&nbsp;</td>
        <td>

<table cellpadding="0" cellspacing="0">
    <tbody>
    <tr>
        <td><br>
            <?php if ($sf_flash->has('successMsg')): ?>
                <div class="ui-widget">
                    <div style="margin-top: 10px; margin-bottom: 10px; padding: 0 .7em;"
                         class="ui-state-highlight ui-corner-all">
                        <p style="margin: 10px"><span style="float: left; margin-right: .3em;"
                                                      class="ui-icon ui-icon-info"></span>
                            <strong><?php echo $sf_flash->get('successMsg') ?></strong></p>
                    </div>
                </div>
                <?php endif; ?>
            <?php if ($sf_flash->has('errorMsg')): ?>
                <div class="ui-widget">
                    <div style="margin-top: 10px; margin-bottom: 10px; padding: 0 .7em;"
                         class="ui-state-error ui-corner-all">
                        <p style="margin: 10px"><span style="float: left; margin-right: .3em;"
                                                      class="ui-icon ui-icon-alert"></span>
                            <strong><?php echo $sf_flash->get('errorMsg') ?></strong></p>
                    </div>
                </div>
                <?php endif; ?>

        </td>
    </tr>
    <tr>
        <td>
            <form action="/member/packageUpgrade" id="topupForm" name="topupForm" method="post">
            <input type="hidden" id="topup_ecash">
            <input type="hidden" id="epointNeeded" value="0"/>
            <table cellspacing="0" cellpadding="0" class="tbl_form">
                <colgroup>
                    <col width="1%">
                    <col width="30%">
                    <col width="69%">
                    <col width="1%">
                </colgroup>
                <tbody>
                <tr>
                    <th class="tbl_header_left">
                        <div class="border_left_grey">&nbsp;</div>
                    </th>
                    <th colspan="2"><?php echo __('Package Upgrade') ?></th>
<!--                    <th class="tbl_content_right"></th>-->
                    <th class="tbl_header_right">
                        <div class="border_right_grey">&nbsp;</div>
                    </th>
                </tr>

                <tr class="tbl_form_row_odd">
                    <td>&nbsp;</td>
                    <td><?php echo __('e-Point Wallet') ?></td>
                    <td><input type="text" readonly="readonly" id="topup_pointAvail" size="20px" value="<?php echo number_format($pointAvailable, 2); ?>"/></td>
                    <td>&nbsp;</td>
                </tr>
                <tr class="tbl_form_row_even">
                    <td>&nbsp;</td>
                    <td><?php echo __('e-Wallet') ?></td>
                    <td><input type="text" readonly="readonly" id="topup_ecashAvail" size="20px" value="<?php echo number_format($ecashAvailable, 2); ?>"/></td>
                    <td>&nbsp;</td>
                </tr>
                <?php
                $showFxpromaxWallet = "display:none";
                //if ($fxpromaxWallet > 0) {
                    $showFxpromaxWallet = "";
                //}
                ?>
                <tr class="tbl_form_row_odd" style="<?php echo $showFxpromaxWallet;?>">
                    <td>&nbsp;</td>
                    <td><?php echo __('Fxpromax Wallet') ?></td>
                    <td><input type="text" readonly="readonly" id="topup_fxpromaxAvail" value="<?php echo number_format($fxpromaxWallet,2); ?>"></td>
                    <td>&nbsp;</td>
                </tr>
                <tr class="tbl_form_row_even">
                    <td>&nbsp;</td>
                    <td><?php echo __('Ranking') ?></td>
                    <td><input type="text" readonly="readonly" size="20px" value="<?php echo __($distPackage->getPackageName()); ?>"/></td>
                    <td>&nbsp;</td>
                </tr>

                <tr class="tbl_form_row_odd">
                    <td colspan="4">
                        <table class="pbl_table" border="1" cellspacing="3" cellpadding="3">
                            <tbody>
                            <tr class="pbl_header">
                                <td valign="middle"><?php echo __('Upgrade Package') ?></td>
                                <td valign="middle"><?php echo __('Price') ?>(<?php echo $systemCurrency; ?>)</td>
                            </tr>
                            <?php
                                if (count($packageDBs) > 0) {
                                    $trStyle = "1";
                                    $combo = "<select name='specialPackageId' id='specialPackageId'>";
                                    foreach ($packageDBs as $packageDB) {
                                        if ($packageDB->getPackageId() >= Globals::MAX_PACKAGE_ID) {
                                            $combo .= "<option value='".$packageDB->getPackageId()."' price='".$packageDB->getPrice()."'>".number_format($packageDB->getPrice(), 0)."</option>";
                                        }
                                    }
                                    $combo .= "</select>";

                                    foreach ($packageDBs as $packageDB) {
                                        if ($packageDB->getPackageId() > Globals::MAX_PACKAGE_ID) {
                                            continue;
                                        }
                                        if ($trStyle == "1") {
                                            $trStyle = "0";
                                        } else {
                                            $trStyle = "1";
                                        }

                                        $packagePrice = number_format($packageDB->getPrice(), 2);
                                        if ($packageDB->getPackageId() == Globals::MAX_PACKAGE_ID) {
                                            $packagePrice = $combo;
                                        }
                                        echo "<tr class='row" . $trStyle . "'>";
                                        $pointNeededOri = $packageDB->getPrice() - $distPackage->getPrice();
                                        $pointNeeded = number_format($pointNeededOri,2);
                                        //$pointNeeded = number_format($packageDB->getPrice(),2);
                                        $ableUpgrade = false;
                                        if ($distPackage->getPrice() < $packageDB->getPrice() || $packageDB->getPackageId() >= Globals::MAX_PACKAGE_ID) {
                                            $ableUpgrade = true;
                                            echo "<td align='left'>&nbsp;&nbsp;
                                                <input type='radio' name='pid' value='".$packageDB->getPackageId()."' ref='".$pointNeededOri."' ".$defaultChecked.">&nbsp;&nbsp;". __($packageDB->getPackageName()) . "</td>
                                                ";
                                        } else {
                                            echo "<td></td>";
                                        }

                                    echo "
                                        <td align='center'>";

                                        if ($ableUpgrade) {
                                            echo $pointNeeded;
                                            //echo $packagePrice;
                                        } else {
                                            echo "--";
                                        }
                                    echo "</td>
                                    </tr>";
                                        }
                                    } else {
                                        echo "<tr class='odd' align='center'><td colspan='7'>" . __('No data available in table') . "</td></tr>";
                                    }
                            ?>
                            </tbody>
                        </table>
                    </td>
                </tr>

                <tr class="tbl_form_row_even" tyle="<?php echo $showFxpromaxWallet;?>">
                    <td>&nbsp;</td>
                    <td><?php echo __('e-Wallet / Fxpromax ') ?></td>
                    <td>
                        <select id="walletType" name="walletType">
                            <option value="ECASH">e-Wallet</option>
                            <option value="FXPROMAX">Fxpromax Wallet</option>
                        </select>
                    </td>
                    <td>&nbsp;</td>
                </tr>

                <tr class="tbl_form_row_odd">
                    <td>&nbsp;</td>
                    <td><?php echo __('e-Point Paid') ?></td>
                    <td><input type="text" id="epointPaid" name="epointPaid" size="20px" value="<?php echo number_format($packagePriceSelected, 2); ?>"/></td>
                    <td>&nbsp;</td>
                </tr>
                <tr class="tbl_form_row_even">
                    <td>&nbsp;</td>
                    <td id="tdEwalletLabel"><?php echo __('e-Wallet Paid') ?></td>
                    <td><input type="text" id="ecashPaid" name="ecashPaid" size="20px" value="0"/></td>
                    <td>&nbsp;</td>
                </tr>

                <tr class="tbl_form_row_even">
                    <td>&nbsp;</td>
                    <td><?php echo __('Security Password'); ?></td>
                    <td>
                        <input name="transactionPassword" type="password" id="transactionPassword"
                                           tabindex="3"/>
                    </td>
                    <td>&nbsp;</td>
                </tr>

                <tr class="tbl_form_row_odd">
                    <td>&nbsp;</td>
                    <td colspan="2" align="center">
                        <button><?php echo __('Submit'); ?></button>
                    </td>
                    <td>&nbsp;</td>
                </tr>
                </tbody>
            </table>

            </form>

            <div class="info_bottom_bg"></div>
            <div class="clear"></div>
            <br>

            <script type="text/javascript" language="javascript">
            var datagrid = null;
            $(function() {
                datagrid = $("#datagrid").r9jasonDataTable({
                            // online1DataTable extra params
                            "idTr" : true, // assign <tr id='xxx'> from 1st columns array(aoColumns);
                            "extraParam" : function(aoData) { // pass extra params to server
                            },
                            "reassignEvent" : function() { // extra function for reassignEvent when JSON is back from server
                                reassignDatagridEventAttr();
                            },

                            // datatables params
                            "bLengthChange": true,
                            "bFilter": false,
                            "bProcessing": true,
                            "bServerSide": true,
                            "bAutoWidth": false,
                            "sAjaxSource": "/finance/packageUpgradeList",
                            "sPaginationType": "full_numbers",
                            "aaSorting": [
                                [1,'desc']
                            ],
                            "aoColumns": [
                                { "sName" : "dist_id", "bVisible" : false,  "bSortable": true},
                                { "sName" : "created_on",  "bSortable": true},
                                { "sName" : "transaction_code",  "bSortable": true},
                                { "sName" : "amount",  "bSortable": true},
                                { "sName" : "status_code",  "bSortable": true},
                                { "sName" : "remarks",  "bSortable": true}
                            ]
                        });
            }); // end function

            function reassignDatagridEventAttr() {
            }
        </script>

        <table cellspacing="0" cellpadding="0" class="tbl_form">
            <colgroup>
                <col width="1%">
                <col width="30%">
                <col width="69%">
                <col width="1%">
            </colgroup>
            <tbody>
            <tr>
                <th class="tbl_header_left">
                    <div class="border_left_grey">&nbsp;</div>
                </th>
                <th><?php echo __('Package Upgrade History') ?></th>
                <th class="tbl_content_right"></th>
                <th class="tbl_header_right">
                    <div class="border_right_grey">&nbsp;</div>
                </th>
            </tr>
            </tbody>
        </table>
        <br>
        <table class="display" id="datagrid" border="0" width="100%">
            <thead>
            <tr>
                <th></th>
                <th><?php echo __('Date') ?></th>
                <th><?php echo __('Transaction Code') ?></th>
                <th><?php echo __('Amount') ?></th>
                <th><?php echo __('Status') ?></th>
                <th><?php echo __('Remarks') ?></th>
            </tr>
            </thead>
        </table>
        </td>
    </tr>
    </tbody>
</table>
<td width="15px">&nbsp;</td>
    </tr>
</table>